<template>
  <div class="profile">
    <h1>This is an profile page</h1>
    <div class="unauth" v-if="!isauth">
      <img src="https://java.crmeb.net/static/images/f.png" alt="" />
      <button @click="toLogin">请点击登录</button>
    </div>
    <div class="authed" v-else>
      <div v-if="userInfo">
        <img class="header_img" :src="userInfo.avatar" alt="" />
        <p>昵称：{{ userInfo.nickname }}</p>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      userInfo: null,
      isauth: false,
    };
  },
  created() {
    this.isauth = localStorage.getItem("token") ? true : false;
    if (this.isauth) {
      this.$axios
        .get("https://apif.java.crmeb.net/api/front/user")
        .then(({ data }) => {
          this.userInfo = data.data;
        });
      this.$axios
        .get("https://apif.java.crmeb.net/api/front/menu/user")
        .then(({ data }) => {
          console.log(data);
        });
    }
  },
  methods: {
    toLogin() {
      this.$router.push("/login?redirect=/profile");
    },
  },
};
</script>

<style lang="scss" scoped>
.header_img {
  width: 100px;
}
</style>
